﻿<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/Site.Master" CodeBehind="Default.aspx.cs" Inherits="OnlineBusinesses.Blogs.Default" %>
<asp:Content ID="Blog_Default_page" runat="server" ContentPlaceHolderID="ContentHome">
    <style>
        .blog_group_list ul li {
            padding:3px;
        }
    </style>
<div class="col-md-12 hidden-xs" style="padding-top:132px;"></div>

<div class="col-md-12 col-xs-12" style="font-family: 'Open Sans', sans-serif !important;">
    <div class="container">
        <div class="col-md-3 col-xs-12" style="padding:20px 10px;">
            <div class="col-md-12 col-xs-12" style="padding:0px;">
                <input class="input_add" type="search" placeholder="Tìm kiếm .." />
            </div>
            <div class="col-md-12 col-xs-12" style="padding:0px;height:1px;background:#ddd;margin:10px 0px;"></div>
            <div class="col-md-12 col-xs-12 blog_group_list" style="padding:10px;">
                <h4 style="color:#888;">Nhóm bài viết</h4>
                <ul>
                    <li>
                        <button class="btn btn-default" style="width:100%;border-radius:0px;color:#555;background:#fdfdfd;">
                            Chiến lượt Marketing
                        </button>
                    </li>
                    <li>
                        <button class="btn btn-default" style="width:100%;border-radius:0px;color:#555;background:#fdfdfd;">
                            SEO Web
                        </button>
                    </li>
                    <li>
                        <button class="btn btn-default" style="width:100%;border-radius:0px;color:#555;background:#fdfdfd;">
                            Kỹ thuật Marketing
                        </button>
                    </li>
                    <li>
                        <button class="btn btn-default" style="width:100%;border-radius:0px;color:#555;background:#fdfdfd;">
                            Thủ thuật Web
                        </button>
                    </li>
                    <li>
                        <button class="btn btn-default" style="width:100%;border-radius:0px;color:#555;background:#fdfdfd;">
                            Mẹo phỏng vấn
                        </button>
                    </li>
                </ul>
                <span class="pull-right btn btn-default" style="border-radius:0px;border:0px;background:#fff;padding:0px 10px;"> . . . </span> 
            </div>

            <div class="col-md-12 col-xs-12" style="padding:0px;height:1px;background:#ddd;margin:10px 0px;"></div>
            <div class="col-md-12 col-xs-12 blog_group_list" style="padding:10px;">
                <h4 style="color:#888;">Sắp xếp</h4>
                <ul>
                    <li>
                        <button class="btn btn-default" style="width:100%;border-radius:0px;color:#555;background:#fdfdfd;">
                            Mới nhất
                        </button>
                    </li>
                    <li>
                        <button class="btn btn-default" style="width:100%;border-radius:0px;color:#555;background:#fdfdfd;">
                            Đọc nhiều nhất
                        </button>
                    </li>
                    <li>
                        <button class="btn btn-default" style="width:100%;border-radius:0px;color:#555;background:#fdfdfd;">
                            Đánh giá cao
                        </button>
                    </li>
                </ul>
            </div>
            <div class="col-md-12 col-xs-12" style="padding:0px;height:1px;background:#ddd;margin:10px 0px;"></div>
            <div class="col-md-12 col-xs-12" style="margin-top: 10px; padding: 0px; padding-bottom: 10px;">
                <span class="btn" style="width:18%;"><i class="fa fa-facebook" style="font-size:20px;"></i></span>
                <span class="btn" style="width:18%;"><i class="fa fa-twitter" style="font-size:20px;"></i></span>
                <span class="btn" style="width:18%;"><i class="fa fa-google-plus" style="font-size:20px;"></i></span>
                <span class="btn" style="width:18%;"><i class="fa fa-skype" style="font-size:20px;"></i></span>
                <span class="btn" style="width:18%;"><i class="fa fa-youtube" style="font-size:20px;"></i></span>
            </div>

        </div>
        <div class="col-md-9 col-xs-12" style="padding:20px 10px;border-left:1px solid #ddd;">
            <!-- Start -->
            <div class="col-md-12 col-xs-12" style="font-weight: bold; font-size: 14px; padding: 0px; padding-top: 5px; padding-bottom: 20px;">
                <div class="col-md-3 col-xs-12" style="padding: 5px; text-align: center; background: #fff;height:195px">
                    <div class="col-md-12 col-xs-12" style="padding:0px;height:195px;background-image: url('http://img.hayhaytv.com/film/20122012/101-Dalmatians-(1996)_26751355963310.jpg');background-repeat: no-repeat;background-position: center;  -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover; ">
                    </div>
                </div>
                <div class="col-md-9 col-xs-12">
                    <div class="col-md-12 col-xs-12" style="padding:0px;">
                        <h3 style="font-weight:bold;margin:0px;padding-top:10px;height:65px;overflow:hidden;">
                                Sự thật 101: Không có chuyện 101 con chó đốm ?
                                Sự thật 101: Không có chuyện 101 con chó đốm ?
                        </h3>
                    </div>
                    <div class="col-md-12 col-xs-12" style="padding:0px;">
                        <h5 style="margin:0px;padding-top:10px;height:86px;overflow:hidden;text-align:justify;">
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                        </h5>
                    </div>
                    <div class="col-md-12 col-xs-12" style="padding:0px;padding-top:10px;">
                        <a class="btn btn-default" style="text-decoration:none;background: #333; border-radius: 0px; color: #fff; font-weight: bold; margin-right: 20px;" href="Detail.aspx">
                            Xem chi tiết
                        </a>
                        <span style="color: #066;line-height:34px;margin:0px 20px;">
                            <i class="fa fa-eye" style="margin-right:7px;"></i>1045
                        </span>
                        <span style="line-height:34px;">
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star-o"></i>
                        </span>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-xs-12" style="padding:0px;height:1px;background:#ddd;margin:10px 0px;"></div>
            <!-- End -->
            <!-- Start -->
            <div class="col-md-12 col-xs-12" style="font-weight: bold; font-size: 14px; padding: 0px; padding-top: 5px; padding-bottom: 20px;">
                <div class="col-md-3 col-xs-12" style="padding: 5px; text-align: center; background: #fff;height:195px">
                    <div class="col-md-12 col-xs-12" style="padding:0px;height:195px;background-image: url('http://img.hayhaytv.com/film/20122012/101-Dalmatians-(1996)_26751355963310.jpg');background-repeat: no-repeat;background-position: center;  -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover; ">
                    </div>
                </div>
                <div class="col-md-9">
                    <div class="col-md-12 col-xs-12" style="padding:0px;">
                        <h3 style="font-weight:bold;margin:0px;padding-top:10px;height:65px;overflow:hidden;">
                                Sự thật 101: Không có chuyện 101 con chó đốm ?
                                Sự thật 101: Không có chuyện 101 con chó đốm ?
                        </h3>
                    </div>
                    <div class="col-md-12 col-xs-12" style="padding:0px;">
                        <h5 style="margin:0px;padding-top:10px;height:86px;overflow:hidden;text-align:justify;">
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                        </h5>
                    </div>
                    <div class="col-md-12 col-xs-12" style="padding:0px;padding-top:10px;">
                        <a class="btn btn-default" style="text-decoration:none;background: #333; border-radius: 0px; color: #fff; font-weight: bold; margin-right: 20px;" href="Detail.aspx">
                            Xem chi tiết
                        </a>
                        <span style="color: #066;line-height:34px;margin:0px 20px;">
                            <i class="fa fa-eye" style="margin-right:7px;"></i>1045
                        </span>
                        <span style="line-height:34px;">
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star-o"></i>
                        </span>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-xs-12" style="padding:0px;height:1px;background:#ddd;margin:10px 0px;"></div>
            <!-- End -->
            <!-- Start -->
            <div class="col-md-12 col-xs-12" style="font-weight: bold; font-size: 14px; padding: 0px; padding-top: 5px; padding-bottom: 20px;">
                <div class="col-md-3 col-xs-12" style="padding: 5px; text-align: center; background: #fff;height:195px">
                    <div class="col-md-12 col-xs-12" style="padding:0px;height:195px;background-image: url('http://img.hayhaytv.com/film/20122012/101-Dalmatians-(1996)_26751355963310.jpg');background-repeat: no-repeat;background-position: center;  -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover; ">
                    </div>
                </div>
                <div class="col-md-9 col-xs-12">
                    <div class="col-md-12 col-xs-12" style="padding:0px;">
                        <h3 style="font-weight:bold;margin:0px;padding-top:10px;height:65px;overflow:hidden;">
                                Sự thật 101: Không có chuyện 101 con chó đốm ?
                                Sự thật 101: Không có chuyện 101 con chó đốm ?
                        </h3>
                    </div>
                    <div class="col-md-12 col-xs-12" style="padding:0px;">
                        <h5 style="margin:0px;padding-top:10px;height:86px;overflow:hidden;text-align:justify;">
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                            Căn cứ theo các nhà khoa học chứng minh, không có vụ con chó đốm lại đẻ được 101 con, cái đó là quá vô lý.
                        </h5>
                    </div>
                    <div class="col-md-12 col-xs-12" style="padding:0px;padding-top:10px;">
                        <a class="btn btn-default" style="text-decoration:none;background: #333; border-radius: 0px; color: #fff; font-weight: bold; margin-right: 20px;" href="Detail.aspx">
                            Xem chi tiết
                        </a>
                        <span style="color: #066;line-height:34px;margin:0px 20px;">
                            <i class="fa fa-eye" style="margin-right:7px;"></i>1045
                        </span>
                        <span style="line-height:34px;">
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star"></i>
                        <i style="color: #fa0; margin-right: 3px;" class="fa fa-star-o"></i>
                        </span>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-xs-12" style="padding:0px;height:1px;background:#ddd;margin:10px 0px;"></div>
            <!-- End -->
            <div class="col-md-12 col-xs-12" style="padding:10px;">
                <span class="pull-left">
                    <i class="fa fa-angle-double-left" style="margin-right:10px;color:#ddd;"></i>
                    <i class="fa fa-angle-left" style="margin-right:10px;color:#ddd;"></i>
                    <a href="#" style="padding:2px;font-size:14px;margin-right:10px;font-weight:bold;">1</a>
                    <a href="#" style="padding:2px;font-size:14px;margin-right:10px;">2</a>
                    <a href="#" style="padding:2px;font-size:14px;margin-right:10px;">3</a>
                    <a href="#" style="padding:2px;font-size:14px;margin-right:10px;">...</a>
                    <i class="fa fa-angle-right" style="margin-right:10px;"></i>
                    <i class="fa fa-angle-double-right" style="margin-right:10px;"></i>
                </span>
                <span class="pull-right">
                    1 - 4 , Tổng 40
                </span>
            </div>
        </div>
    </div>
</div>
</asp:Content>
